{extend name="public/base"}

{block name="x-body"}
<style>
  #box {
    border: 1px solid #2cbca3;

    padding: 0 20px;

    position: relative;
  }

  #box #editOrder {
    position: absolute;
    right: 0;
    top: 0;

    z-index: 99;
  }

  #box .layui-table {
    border-bottom: 1px solid #e5e5e5;
  }

  #box th {
    background: white;
    color: #656565;
    font-weight: bold;
  }

  #box td div {
    width: 100px;

    display: inline-block;

    color: #999;
    text-align: right;
  }

  #box td span {
    color: black;
    font-size: 13px;
  }

  .box_table thead th {
    background: #f2f2f2 !important;

    font-weight: normal;
    font-size: 12px;
    text-align: center;
  }

  .box_table tbody td {
    font-size: 12px;
    text-align: center;
  }

  .layui-input-inline .layui-anim {
    text-align: left;
  }

  #box .logistics div {
    display: none;
  }

  .box_table div {
    width: inherit !important;
  }

</style>
    <div class="x-body">
      <div class="layui-row">
        <div class="layui-col-md8 layui-col-md-offset2" id="box">
          {if $order.order_status == 0 && $order.pay_status == 0 && $order.shipping_status == 0}
          <button class="layui-btn layui-btn" onclick="load_url('{:url(\'orders/order_form\', [\'id\' => $order.id])}')" id="editOrder"><i class="layui-icon">&#xe642;</i>修改订单</button>
          {/if}
          <div class="layui-row">

            <form class="layui-form">
              <!-- 基本信息 -->
              <table class="layui-table layui-form" lay-skin="nob">

                <colgroup>
                  <col width="33%">
                  <col width="33%">
                  <col width="33%">
                </colgroup>
                <thead>
                  <tr>
                    <th colspan="3">基本信息</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td>
                      <div>订单编号：</div>
                      <span>{$order.order_sn}</span>
                      <input type="hidden" name="order_sn" value="{$order.order_sn}" >
                    </td>
                    <td>
                      <div>下单时间：</div>
                      <span>{$order.add_time|date="Y-m-d H:i"}</span>
                    </td>
                    <td>
                      <div>配送费用：</div>
                      <span>{$order.shipping_price}</span>
                      <input type="hidden" name="shipping_price" value="{$order.shipping_price}" >
                    </td>
                  </tr>

                  <tr>
                    <td>
                      <div>物流公司：</div>
                      <div class="layui-input-inline">
                        <select name="shipping_code" lay-filter="province">
                          {volist name="order.shipping" id="v"}
                          <option value="{$v.shipping_code}-{$v.shipping_name}">{$v.shipping_name}</option>
                          {/volist}
                        </select>
                      </div>
                    </td>
                    <td>
                      <div>发货方式：</div>
                      <div class="layui-input-inline">
                        <select name="send_type" lay-filter="send_type">
                          <option value="3">无需物流</option>
                          <option value="0">手填物流单号</option>
                        </select>
                      </div>
                    </td>
                    <td class="logistics">
                      <div>配送单号：</div>
                      <div class="layui-input-inline" style="width: 150px;">
                        <input type="text" id="invoice_no" name="invoice_no"
                               autocomplete="off" class="layui-input" value="" onfocus="isNum(this)">
                      </div>
                    </td>
                  </tr>
                </tbody>
              </table>

              <!-- 收货信息 -->
              <table class="layui-table" lay-skin="nob">
                <colgroup>
                  <col width="33%">
                  <col width="33%">
                  <col width="33%">
                </colgroup>
                <thead>
                <tr>
                  <th colspan="3">收货信息</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                  <td>
                    <div>收货人：</div>
                    <span>{$order.consignee}</span>
                    <input type="hidden" name="consignee" value="{$order.consignee}" >
                  </td>
                  <td>
                    <div>联系方式：</div>
                    <span>{$order.mobile}</span>
                    <input type="hidden" name="mobile" value="{$order.mobile}" >
                  </td>
                  <td>
                    <div>邮编：</div>
                    <span>{$order.zipcode}</span>
                    <input type="hidden" name="zipcode" value="{$order.zipcode}" >
                  </td>
                </tr>
                <tr>
                  <td>
                    <div>E-Mail：</div>
                    <span>{$order.email ? $order.email : '无'}</span>
                  </td>
                  <td>
                    <div>发票抬头：</div>
                    <span>{$order.invoice_title ? $order.invoice_title : '无'}</span>
                  </td>
                  <td>
                    <div>纳税人识别号：</div>
                    <span>{$order.taxpayer ? $order.taxpayer : '无'}</span>
                  </td>
                </tr>
                <tr>
                  <td colspan="3">
                    <div style="text-align: right;">收货地址：</div>
                    <span>{$order.province} {$order.city} {$order.district} {$order.address}</span>
                    <input type="hidden" name="city" value="{$order.city}" >
                    <input type="hidden" name="district" value="{$order.district}" >
                    <input type="hidden" name="address" value="{$order.address}" >
                  </td>
                </tr>
                <tr>
                  <td colspan="3">
                    <div>用户备注：</div>
                    <span>{$order.user_note}</span>
                  </td>
                </tr>
                </tbody>
              </table>

              <!-- 商品信息 -->
              <table class="layui-table" lay-skin="nob">
                <colgroup>
                  <col width="33%">
                  <col width="33%">
                  <col width="33%">
                </colgroup>
                <thead>
                  <tr>
                    <th colspan="3">商品信息</th>
                  </tr>
                </thead>
                <tbody>
                  <tr>
                    <td>
                      <table class="layui-table box_table" lay-skin="line" style="margin: 0;">
                        <thead>
                          <tr>
                            <th>商品</th>
                            <th>规格属性</th>
                            <th>数量</th>
                            <th>单品{$order.integral ? '积分' : '价格'}</th>
                            <th>选择发货</th>
                          </tr>
                        </thead>
                        <tbody>
                          {volist name="$order.goods" id="v"}
                          <tr>
                            <td>
                              <img src="{:config('imgRoute')}{$v.original_img}" style="width: 30px; height: 30px;" alt="">
                              {$v.goods_name}
                            </td>
                            <td>{$v.spec_key_name}</td>
                            <td>{$v.goods_num}</td>
                            <td>{$v.goods_integral ? $v.goods_integral : $v.goods_price}</td>
                            <td>
                              {if $v.is_send}
                                已发货
                              {else /}
                                <input type="checkbox" name="goods[{$v.id}]" value="1" lay-skin="primary" checked>
                              {/if}
                            </td>
                          </tr>
                          {/volist}
                        </tbody>
                      </table>
                    </td>
                  </tr>
                </tbody>
              </table>

              <!-- 发货单备注 -->
              <table class="layui-table" lay-skin="nob">
                <colgroup>
                  <col width="33%">
                  <col width="33%">
                  <col width="33%">
                </colgroup>
                <thead>
                <tr>
                  <th colspan="3">发货单备注</th>
                </tr>
                </thead>
                <tbody>
                    <tr>
                      <td colspan="3">
                        <input type="hidden" name="user_id" value="{$order.user_id}" >
                          <input type="hidden" name="order_id" value="{$order.id}">
                          <input type="hidden" name="admin_id" value="{$Think.session.user.id}">
                          <input type="hidden" name="action_user" value="{$Think.session.user.id}">
                          <div style="width: 100%;">
                            <div style="float: left;">发货单备注：</div>
                            <textarea placeholder="请输入操作备注" id="note" name="note" class="layui-textarea" style="width: 60%; float: left; margin: 0 0 6px 4px;"></textarea>
                          </div>

                          <div>可执行操作：</div>
                          <button class="layui-btn" lay-filter="add1" lay-submit="" data-name="shipping_status" data-val="1">确定发货</button>
                      </td>
                    </tr>
                </tbody>
              </table>

              <!-- 发货记录 -->
              <table class="layui-table" lay-skin="nob">
                <colgroup>
                  <col width="33%">
                  <col width="33%">
                  <col width="33%">
                </colgroup>
                <thead>
                <tr>
                  <th colspan="3">发货记录</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                  <td>
                    <table class="layui-table box_table" lay-skin="line" style="margin: 0;">
                      <thead>
                      <tr>
                        <th>操作者</th>
                        <th>发货时间</th>
                        <th>发货单号</th>
                        <th>收货人</th>
                        <th>快递公司</th>
                        <th>备注</th>
                      </tr>
                      </thead>
                      <tbody>
                        {volist name="order.deliver" id="v"}
                        <tr>
                          <td>{$v.username}</td>
                          <td>{$v.create_time}</td>
                          <td>{$v.invoice_no}</td>
                          <td>{$v.consignee}</td>
                          <td>{$v.shipping_name}</td>
                          <td>{$v.note}</td>
                        </tr>
                        {/volist}
                      </tbody>
                    </table>
                  </td>
                </tr>
                </tbody>
              </table>
            </form>
          </div>
        </div>
      </div>
    </div>

<script>
    $(function (){
        layui.use('form', function(){
            var form = layui.form;

            form.on('submit(add1)', function(data){
                let url = "{:url('orders/order_deliver')}";
                let json = data.field;
                let name = data.elem.dataset.name;
                let code = data.elem.dataset.val;
                json.pay_status = '{$order.pay_status}';
                json.order_status = '{$order.order_status}';
                json.shipping_status = '{$order.shipping_status}';
                json[name] = code;

                let shipping = json.shipping_code.split('-');
                json.shipping_code = shipping[0];
                json.shipping_name = shipping[1];

                json.status_desc= '确认发货';

                $.post(url, data.field, function(res){
                    if(res.code == 0){
                        dialog(res.msg, false, 0, function (){
                            $("input[name='__token__']",top.window.document).val(res.data.token);
                        });
                    }else if(res.code == 1){
                        dialog(res.msg, res.url, 0, function (){
                            $("input[name='__token__']",top.window.document).val(res.data.token);
                        }, true);
                    }
                }, 'json');

                return false;
            });

            form.on('select(send_type)', function(data){
                if(data.value == 0){
                    $(".logistics div").css('display', 'inline-block');
                    $(".logistics input").attr('require', '');
                    $(".logistics input").attr('require', '');
                    $(".logistics input").attr('lay-verify', "required");
                }else{
                    $(".logistics div").css('display', 'none');
                    $(".logistics input").removeAttr('require');
                    $(".logistics input").removeAttr('lay-verify');
                }
            })
        });
    })

</script>
{/block}